<script type="text/javascript" src="/js/private/generate/querybuilder/index.js"></script>
<script type="text/javascript" src="/js/html-template-factory.js"></script>
<script type="text/javascript" src="/js/script.js"></script>
<link media="screen" type="text/css" href="/css/booktour/generate/querybuilder/index.css" rel="stylesheet">
<div id="" class="tabbed_box">
    <div class="tabbed_area">    	
        <ul class="tabs">
        <li><a onclick="" title="content_1" class="tab active">QUERY BUILDER</a></li>
        </ul>
        <div style="display: block;" id="builder_1" class="content">
        <ul style="padding:0px 0px !important;height:300px;" id="desktop" draggable="true">
            <div id="QueryBuilder-Menu">
                <div class="QueryBuilder_Content">       
                    <form name="frmMenu" action="" method="POST">
                    <select name="tables" value="">
                        <option value="">---Chọn bảng---</option>
                        <?php 
                            $i = 0;
                            foreach($this->listTable as $item){
                                foreach(array_keys($item) as $subItem){
                                $tableName = $this->listTable[$i][$subItem];
                                echo "<option value='".$tableName."'>".$tableName."</option>";
                                }
                                $i++;
                            }
                        ?>
                    </select>
                    <span onmousedown="changeClassButtonAdd(this)" onmouseup="changeClassButtonAdd(this)" onclick="getTableInfo()" class="add_funtion">&nbsp;+&nbsp;</span>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <select name="" value="">
                        <option value="">---WHERE---</option>
                    </select>
                    <span onmousedown="changeClassButtonAdd(this)" onmouseup="changeClassButtonAdd(this)" onclick="getTableInfo()" class="add_funtion">&nbsp;+&nbsp;</span>
                    
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <select name="" value="">
                        <option value="">---ORDER BY---</option>
                    </select>
                    <span onmousedown="changeClassButtonAdd(this)" onmouseup="changeClassButtonAdd(this)" onclick="getTableInfo()" class="add_funtion">&nbsp;+&nbsp;</span>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <select name="" value="">
                        <option value="">---GROUP BY---</option>
                    </select>
                    <span onmousedown="changeClassButtonAdd(this)" onmouseup="changeClassButtonAdd(this)" onclick="getTableInfo()" class="add_funtion">&nbsp;+&nbsp;</span>
                    
                    
                    </form>
                </div>
            </div>
            <div class="clear">&nbsp;</div>
            <div id="QueryBuilder-Body">
                
            </div>
        </ul>
        </div>
    </div>
</div>
<div class="clear">&nbsp;</div>
<div id="HTML-TEMPLATE-ITEM" style="display:none">    
    <div id="TEMPLATE-ROOT" style="display:none">        
        <div class="QB_Table_Header">                        
            <div style="float:left;width:180px;height:25px;"">
                <span class="TableNameLable" >{tableName}</span>
            </div>
            <div style="float:left;width:20px;height:25px;">
                <span class="deleteTableIcon" onclick="deleteTable('{tableName}')">x</span>
            </div>
        </div>
        <div class="QB_Table_Body" id="listColTable_{tableName}" style="height:{height}px" draggable="false" >
            {loop listCol TEMPLATE-ITEM}
        </div>     
    </div>
    <div id="TEMPLATE-ITEM">
        <div class="QB_Table_Body_Item" onclick='selectCol(this)'>
            {Field}
        </div>
    </div>
</div>